<template>
  <view id="accountlist-box">
    <!-- <span @click="navto" class="addAccount"> -->
    <!-- <i class="iconfont iconadd"></i>绑定账号 -->
    <!-- </span> -->
    <view class="search_box">
      <input type="text" v-model="searchText" placeholder="请输入关键字"/>
      <i class="iconfont iconsousuo"></i>
    </view>
    <view class="content">
      <view class="con" v-if="searchList.length>0">
        <view
          class="item"
          v-for="(e,i) in searchList"
          :key="i"
          @click="hangleClickProject(e)"
        >{{e.project_name}}</view>
      </view>
      <view class="con" v-else>
        <span>暂无数据</span>
      </view>
      <span v-show="false">{{searchFilter}}</span>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      token: wx.getStorageSync("userInfo").token,
      projectlist: [],
      searchText: "",
      searchList: []
    };
  },
  onUnload() {
    //if (!wx.getStorageSync("projectData").project_name) {
    //  wx.showModal({
    //    title: "提示",
    //    content: "未选择项目将自动为您选择第一个",
    //    success: res => {
    //      if (res.confirm) {
    //        console.log(123);
    //        wx.setStorageSync("projectData", this.projectlist[0]);
    //      } else if (res.cancel) {
    //        this.$routerTo({ url: "./ProjectList" });
    //      }
    //    }
    //  });
    //}
    if (!wx.getStorageSync("projectData").project_name) {
      wx.setStorageSync("projectData", this.projectlist[0]);
      uni.showToast({
        title: "未选择项目将自动选择第一个",
        icon: "none"
      });
    }
  },
  computed: {
    // 运行相对流畅暂不套节流
    searchFilter() {
      this.searchList = this.projectlist.filter(
        v => v.project_name.indexOf(this.searchText) >= 0
      );
      return "";
    }
  },
  methods: {
    hangleClickProject(e) {
      wx.setStorageSync("projectData", e);
      this.$routerTo({ url: "./index" });
    },
    //navto() {
    //  uni.navigateTo({
    //    url: "../../personal/accountList/index"
    //  });
    //},
    getdata() {
      this.$axios({
        url: "api/smart/getProjectList",
        data: { token: this.token }
      }).then(
        res => {
          this.projectlist = res.data.returnData.list;
          //if (this.projectlist.length === 0) {
          //  // 如果没有数据 可能是没有绑定账号
          //  this.$axios({
          //    url: "/api/smart/getAccountList",
          //    data: { token: this.token }
          //  }).then(res => {
          //    if (res.data.returnData.userList.length == 0) {
          //      uni.navigateTo({
          //        url: "../../personal/accountList/index"
          //      });
          //    }
          //  });
          //}
        },
        error => {
          console.log(error);
        }
      );
    }
  },
  onShow() {
    this.getdata();
  },
  created() {
    if (!this.token) {
      uni.navigateTo({ url: "../../pages/login/index" });
      return;
    } // 如果没有登陆直接跳
  }
};
</script>

<style lang="scss">
page {
  background: #fff;
}
.search_box {
  background: #3271ef;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100rpx;
  position: relative;
  input {
    width: 600rpx;
    height: 50rpx;
    background: #fff;
    border-radius: 25rpx;
    padding-left: 60rpx;
  }

  i.iconfont.iconsousuo {
    position: absolute;
    left: 90rpx;
    top: 36rpx;
    font-size: 30rpx;
  }
}
#accountlist-box {
  .addAccount {
    // background: #eaedf4;
    // display: flex;
    // justify-content: center;
    // align-items: center;
    // line-height: 100rpx;
  }
  .content {
    padding-right: 50rpx;
    padding-left: 50rpx;
  }
  .con {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    .item {
      width: 100%;
      text-align: center;
      line-height: 80rpx;
      border-bottom: 1px solid #ddd;
    }
  }
}
.iconfont {
  font-size: 24rpx;
  line-height: 32rpx;
  width: 32rpx;
  border-radius: 50%;
  text-align: center;
  color: #666;
  margin-right: 20rpx;
}
</style>